<template>
   <div>
      <ul>
        <li v-for="todo in todos" :key="todo.id">
          <input type="checkbox" :checked="todo.done" @change="changeChecked(todo.id)"/>
          <span>{{todo.name}}</span>
          <button @click="deleteObj(todo.id)">删除</button>
        </li>
      </ul>
    </div>
</template>

<script>
import MyItem from './MyItem.vue'

export default {
    name: 'MyList',
    components:{
        MyItem
    },
    props:['todos','deleteTask','changeTaskDone'],
    methods:{
        deleteObj(id){
          this.deleteTask(id)
        },
        changeChecked(id){
          this.changeTaskDone(id)
        }
    }
}
</script>

<style>

</style>